
import Icon from '@ant-design/icons';
import * as THREE from 'three';
import { Button, List } from "antd";
import React from "react";
import styles from '../../index.module.less';
import { ReactComponent as CubeSvg } from './cube.svg';
import Controller from 'Controller'

export default function PointLight() {

    const threeController = Controller.instance.useMemo(s => s.threeController, [])

    const onClick = React.useCallback(() => {
        const pointLight = new THREE.PointLight(0xFDF5E6, 1, 200)
        pointLight.name = '点光源-' + pointLight.uuid;
        threeController.sceneAdd(pointLight);
    }, [threeController])

    return (
        <List.Item actions={[<Button type="link" onClick={onClick} >添加</Button>]}>
            <span className={styles.icon} >
                <Icon component={CubeSvg} />
            </span>
            点光源
        </List.Item>
    )
}